<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"
	href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />
<link rel="stylesheet" href="jqm-icon-pack-1.1.1-original.css" />
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script
	src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>
<title>Fil pilote</title>
</head>

<body>
	<div data-role="page" class="type-interior" id="album-list">
		<div data-role="header">
			<h1>Fil pilote</h1>
			<!-- 			<a href="../../" data-icon="home" data-iconpos="notext"
				data-direction="reverse">Home</a> <a href="../nav.html"
				data-icon="search" data-iconpos="notext" data-rel="dialog"
				data-transition="fade">Search</a>
 -->
		</div>
		<!-- /header -->

		<div data-role="content">
			<a href="#" data-role="button" data-theme="a" data-icon="home" data-iconpos="right">Zone 1</a>
			<ul data-role="listview" data-inset="true">
				<li><a href="#settings" data-rel="dialog"
					data-transition="slideup"> RdC<span class="ui-li-count">Confort</span>
				</a></li>
				<li><a href="#settings" data-rel="dialog"
					data-transition="slideup"> Salon<span class="ui-li-count">Confort</span>
				</a></li>
			</ul>
		</div>
		<!-- /content -->

		<div data-role="footer">
			<p>
				Last refreshed: <span class="time">never</span>
			</p>
		</div>

	</div>
	<!-- /page -->

	<!-- dialog -->

	<div data-role="page" id="settings">

		<div data-role="header">
			<h1>Zone - Fil pilote</h1>
		</div>

		<div data-role="controlgroup">
			<a href="#" data-role="button" data-icon="refresh">Automatique</a> <a
				href="#" data-role="button" data-icon="home">Confort</a> <a href="#"
				data-role="button" data-icon="euro">Economique</a> <a href="#"
				data-role="button" data-icon="pause">Hors gel</a> <a href="#"
				data-role="button" data-icon="power">Eteint</a>
		</div>
	</div>

	<!-- /dialog -->

</body>
</html>
